<!-- <template>
   <el-row :gutter="20">
      <el-col :span="6">
         <el-card class="box-card">
            <template #header>
                  <el-avatar class="avatar" :src="admin.avatar" shape="square" :size="40">
                  </el-avatar>
                  <span style="font-size:24px;">{{ admin.username }}</span>
               </template>
               <div class="info">
                  <p>登陆时间：{{ loginInfo.loginTime }}</p>
                  <p>登陆地点：{{ loginInfo.loginPlace }}</p>
               </div>
         </el-card>
      </el-col>
   </el-row>
</template> -->

<template>
  首页
</template>

<!-- <script setup>
import {reactive,onMounted} from 'vue'
import {getAdmin} from '../../api'
import useAdmin from '../../stores/admin'

const {admin,updateAdmin}=useAdmin()
onMounted(()=>{
   loadAdmin()
})

const loadAdmin = async()=>{
   let data=await getAdmin()
   updateAdmin({
      username:data.username,
      avatar:data.avatar
   })
}

const loginInfo=reactive({
   loginTime:'2023-07-22 09:00:00',
   loginPlace:'北京'
})
</script> -->

<style lang="scss" scoped>
.el-row {
  margin-bottom: 20px;
  &:last-child {
    margin-bottom: 0;
  }
  .el-col {
    .box-card {
      .card-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
      }
      .info {
        font-size: 14px;
      }
    }
  }
}
.card-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border: 1px solid #e4e7ed;
  text-align: center;
  padding-right: 20px;
  .card-left-container {
    color: white;
  }
  .card-right-container {
    .number {
      font-size: 18px;
      font-weight: bold;
    }
  }
}
</style>